<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8" />
		<title>Image Gallery</title>
		<link rel="stylesheet" href="styles/layout.css">
	</head>
	<body>
		<h1>Snapshots</h1>
		<ul id="imagegallery">
			<li>
				<a href="../images/fireworks.jpg" title="A fireworks display">
					<img src="../images/thumbnail_fireworks.jpg" alt="Fireworks">
				</a>
			</li>
			<li>
				<a href="../images/coffee.jpg" title="A cup of black coffee">
					<img src="../images/thumbnail_coffee.jpg" alt="Coffee">
				</a>
			</li>
			<li>
				<a href="../images/rose.jpg" title="A red, red rose">
					<img src="../images/thumbnail_rose.jpg" alt="Rose">
				</a>
			</li>
			<li>
				<a href="../images/bigben.jpg" title="The famous clock">
					<img src="../images/thumbnail_bigben.jpg" alt="Big Ben">
				</a>
			</li>
		</ul>
		<script src="scripts/showPic.js"></script>
	</body>
</html>
